<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ page isELIgnored="false"%>
<jsp:include page="../frame/header.jsp"></jsp:include>

<title>创建学习小组</title>
<style>
#picture{
	position:absolute;
	left:500px;
	top:400px;
}
</style>
</head>

<body>
	<div class="container-fluid">
		<div class="row-fluid">
			<div>
				<ul class="breadcrumb">
					<li><a href="#">学术讨论</a> <span class="divider">/</span></li>
					<li><a href="#">学习小组</a></li>
				</ul>
			</div>

			<div class="box">
				<div class="box-header well" data-original-title>
					<h2>
						<i class="icon-edit"></i> 创建学习小组
					</h2>
					<div class="box-icon">
						<a href="#" class="btn btn-setting btn-round"><i
							class="icon-cog"></i></a> <a href="#"
							class="btn btn-minimize btn-round"><i class="icon-chevron-up"></i></a>
						<a href="#" class="btn btn-close btn-round"><i
							class="icon-remove"></i></a>
					</div>
				</div>
				<div class="box-content">
					<form id="myform" class="form-horizontal" method="post" action="<c:url value="/admin/study/group" />">
						<fieldset>
							<input type="hidden" name="groupId" value="${group.groupId }">
							<div class="control-group">
								<label class="control-label" for="title">小组名称</label>
								<div class="controls">
									<input class="input-xlarge focused" name="name" check-type="required" required-message="请输入小组名称"
										id="name" type="text" value="${group.name }" maxlength="100">
								</div>
							</div>
							<div class="control-group">
								<label class="control-label" for="sortId">院系专业</label>
								<div class="controls">
									<select data-placeholder="请选择所属专业" id="sorts_0" name="sortId" data-rel="chosen" class="input-xlarge">
										
									</select>
								</div>
							</div>
							<div class="control-group">
								<label class="control-label" for="description_mc">详细描述</label>
								<div class="controls">
									<textarea id="description_mc" name="description_mc" rows="8" check-type="required" required-message="请输入详细描述"
										 class="xheditor-simple input-xxlarge">${group.description_mc }</textarea>
								</div>
							</div>
							<div class="control-group">
								<label class="control-label" for="viewPerm">浏览权限</label>
								<div class="controls">
									<label class="radio inline"> 
										<input type="radio" name="viewPerm" value="0" <c:if test="${group.viewPerm == 0 }">checked</c:if>>所有人
									</label> 
									<label class="radio inline"> 
										<input type="radio" name="viewPerm" value="1" <c:if test="${group.viewPerm == 1 }">checked</c:if>>仅成员
									</label>
								</div>
							</div>
							<div class="control-group">
								<label class="control-label" for="joinType">加入方式</label>
								<div class="controls">
									<label class="radio inline"> 
										<input type="radio" name="joinType" value="0" <c:if test="${group.joinType == 0 }">checked</c:if>>自由加入
									</label> 
									<label class="radio inline"> 
										<input type="radio" name="joinType" value="1" <c:if test="${group.joinType == 1 }">checked</c:if>>邀请加入
									</label>
									<label class="radio inline"> 
										<input type="radio" name="joinType" value="2" <c:if test="${group.joinType == 2 }">checked</c:if>>审核加入
									</label>
								</div>
							</div>

							<div class="control-group">
								<label class="control-label" for="fileInput">小组图片</label>
								<div class="controls">
									<input class="input-file uniform_on" name="file"
										id="userHeader" type="file"> <input type="button" class="btn btn-success"
										value="upload" onclick="return ajaxFileUpload();">
								</div>
								<img id="loading" class="hide" src="<c:url value="/resources/img/ajax-loader-6.gif"/>">
								<img id="picture" src='<c:url value="/resources/fileupload/${group.banner }"/>'  height="100">
								<input type="hidden" name="banner" id="sortPic" value="${group.banner }">
							</div>
							
							<div class="control-group">
												<label class="control-label" for="commentBaseCount">评论基数</label>
												<div class="controls">
													<input class="input-xlarge" id="commentBaseCount"
														name="commentBaseCount" type="text"
														value="${group.commentBaseCount }" check-type="number">
												</div>
											</div>
				
											<input name="commentCount" type="hidden"
												value="${group.commentCount }"> <input name="praiseCount"
												type="hidden" value="${group.praiseCount }">
				
											<div class="control-group">
												<label class="control-label" for="praiseBaseCount">点赞基数</label>
												<div class="controls">
													<input class="input-xlarge" id="praiseBaseCount"
														name="praiseBaseCount" type="text"
														value="${group.praiseBaseCount }" check-type="number">
												</div>
											</div>
							
							<div class="form-actions">
								<button id="saveBtn" type="button" class="btn btn-primary">保存</button>
								<button id="cancelBtn" type="button" class="btn">返回</button>
							</div>
						</fieldset>
					</form>

				</div>
			</div>
			<!--/span-->

		</div>
	</div>
	<!--/row-->
</body>

<jsp:include page="../frame/scripts.jsp"></jsp:include>
<script type="text/javascript">

var images = new Array();

$(document).ready(function(){
	$('#cancelBtn').click(function(){
		window.location.href = '<c:url value="/admin/study/group" />';	
	})
	
	$("#myform").validation();
	
	//保存
	$('#saveBtn').click(function(){
		if($("#sorts_0").val() == null){
			alert("请首先创建二手物品分类！");
			return;
		}
		var value = images.join(",");
		$("input[name='images']").val(value);
		
		$("#myform").submit();
	})
	
	//初始化
	$.ajax({
			url:'<c:url value="/admin/study/faculty/tree" />',
			dataType:'json',
			success:function(data){
				//搜索表单初始化版块下拉框
				createTree(data,"sorts");
				//设置选中
				$("#sorts_0").val("${group.sortId}");
				
				//增加下拉框样式
				//$('[data-rel="chosen"],[rel="chosen"]').chosen();
			}
		})
})

//上传图片
function ajaxFileUpload(){
		
		$("#loading").ajaxStart(function(){
			//开始上传文件时显示一个图片
			$(this).show();
		}).ajaxComplete(function(){
			//文件上传完成将图片隐藏起来
			$(this).hide();
		});
		
		$.ajaxFileUpload({
			url:'<c:url value="/fileupload"/>',//用于文件上传的服务器端请求地址
			secureuri:false,//一般设置为false
			fileElementId:'userHeader',//文件上传空间的id属性  <input type="file" id="file" name="file" />
			dataType: 'JSON',//返回值类型 一般设置为json(大写)
			success: function (data, status){
				var image = DOMAIN + '/resources/fileupload/'+$(data).html();
				$("#picture").attr('src',image).show();
				$("input[name='banner']").val($(data).html());
			},
			error: function (data, status, e){
				alert(e);
			}	
		})
		
		return false;
	}

function createTree(data,tagId){
	$.each(data,function(i,item){
		//生成节点
		createNode(item,tagId);
		if(item.children.length > 0){
			//生成子节点
			createTree(item.children,tagId);
		}
	})
}

function createNode(item,tagId){
	var $parent_select = $("#"+tagId+"_"+item.sortParent);
	var str = '';
	if(item.children.length > 0){
		str += '<optgroup id="'+tagId+'_'+item.sortId+'" label="'+item.sortName+'">';
		str += '</optgroup>';
	}else{
		str += '<option value='+item.sortId+'>'+item.sortName+'</option>';
	}
	$parent_select.append(str);
}
</script>